<template>
	<view class="uni-container">
		<uni-forms ref="form" labelWidth="100px" v-model="formData" validateTrigger="bind">
			<uni-forms-item name="title" label="标题" required>
				<uni-easyinput v-model="formData.title" :clearable="false" placeholder="请输入标题" />
			</uni-forms-item>
			<uni-forms-item name="source" label="副标题" required>
				<uni-easyinput v-model="formData.source" :clearable="false" placeholder="请输入副标题" />
			</uni-forms-item>
			<uni-forms-item name="link" label="外链">
				<uni-easyinput v-model="formData.link" :clearable="false" placeholder="请输入外链地址" />
			</uni-forms-item>
			<uni-forms-item name="content" label="内容">
				<webEdit v-model="formData.content" placeholder="请输入内容" ids="content"></webEdit>
			</uni-forms-item>
			<uni-forms-item name="mobile" label="封面图" required>
				<div>
					<uni-file-picker limit="1" title="最多选择1张图片" @select="uploadImg"></uni-file-picker>
				</div>
			</uni-forms-item>
			<uni-forms-item name="read" label="阅读量">
				<uni-easyinput v-model="formData.read" :clearable="false" placeholder="请输入阅读量" />
			</uni-forms-item>
			<uni-forms-item name="datetime" label="发布日期">
				<uni-datetime-picker type="datetime" v-model="formData.create_time" @change="changeLog" />
			</uni-forms-item>
			<view class="uni-button-group">
				<button style="width: 100px;margin-right: 30rpx;" class="uni-button" @click="cancel">返回</button>
				<button style="width: 100px;background-color: #2979ff;color: #fff;" class="uni-button"
					@click="submit">发布</button>
			</view>
		</uni-forms>
	</view>
</template>

<script>
	const db = uniCloud.database();
	export default {
		data() {
			return {
				showPassword: false,
				editorOption: {},
				formData: {
					title: "",
					source: "",
					content: "",
					photo_url: "",
					create_time: "",
					userName: "",
					read: 0,
					link: '',
					type: ''
				},
			}
		},

		onLoad() {},

		methods: {
			GetChange(e) {
				console.log('111', e)
			},
			// 选择图片
			uploadImg(e) {
				console.log(e)
				console.log(e)
				uni.showLoading({
					title: '上传中'
				})
				e.tempFilePaths.forEach(item => {
					uniCloud.uploadFile({
						filePath: item, //要上传的文件对象
						cloudPath: 'a.jpg', //保存在云端的文件名，这里以时间戳命名
						success: res => {
							console.log('tupian', res)
							this.formData.photo_url = res.fileID
							uni.hideLoading()
						},
						fail: Res => {
							uni.hideLoading()
							uni.showToast({
								title: '上传失败！',
								icon: 'none'
							})
							console.log('失败', Res)
						}
					})
				})
			},
			changeLog(e) {
				console.log(e)
				this.formData.create_time = e
			},
			cancel() {
				uni.navigateBack({
					delta: 1
				})
			},
			/**
			 * 新增
			 * @param {Object} 
			 */
			submit() {
				console.log(this.formData)
				if (this.formData.title == '') {
					uni.showToast({
						title: '请输入标题！',
						icon: 'none'
					})
					return
				} else if (this.formData.source == '') {
					uni.showToast({
						title: '请输入副标题！',
						icon: 'none'
					})
					return
				} else if (this.formData.content == '') {
					uni.showToast({
						title: '请输入内容！',
						icon: 'none'
					})
					return
				} else if (this.formData.photo_url == '') {
					uni.showToast({
						title: '请上传封面图！',
						icon: 'none'
					})
					return
				} else if (this.formData.create_time == '') {
					uni.showToast({
						title: '请选择日期！',
						icon: 'none'
					})
					return
				}
				uni.showLoading({
					mask: true
				})
				this.formData.type = 'add'
				this.formData.read = Number(this.formData.read)
				uniCloud.callFunction({
					name: 'articleadmin',
					data: this.formData,
					success: res => {
						if (res.result.code == 200) {
							uni.hideLoading()
							uni.showToast({
								title: '发布成功！',
								icon: 'success'
							})
							setTimeout(() => {
								uni.navigateBack({
									delta: 1
								})
							}, 500)
						}

					},
					fail: err => {
						uni.hideLoading()
						uni.showToast({
							title: '发布失败！',
							icon: 'none'
						})
					}
				})

			},
			// status 对应文字显示
			parseUserStatus(status) {
				if (status === 0) {
					return '启用'
				} else if (status === 1) {
					return '禁用'
				} else if (status === 2) {
					return '审核中'
				} else if (status === 3) {
					return '审核拒绝'
				} else {
					return '启用'
				}
			}
		}
	}
</script>

<style>
	#editor {
		width: 100%;
		height: 300px;
		background-color: #CCCCCC;
	}

	.reset-password-btn {
		/* height: 100%; */
		line-height: 36px;
		color: #007AFF;
		text-decoration: underline;
		cursor: pointer;
	}

	.cancel-reset-password-btn {
		color: #007AFF;
		padding-right: 10px;
		cursor: pointer;
	}
</style>